<template>
  <div style="width:100%" v-loading="loading">
    <el-table size="mini" :data="list.data" :header-cell-style="{background:'#f1f1f1'}">
      <el-table-column type="index" width="50px"></el-table-column>
      <el-table-column label="跑团名称" prop="Title"></el-table-column>
      <el-table-column label="ID" prop="IdCode" width="70px"></el-table-column>
      <el-table-column label="团长" prop="Contacter" width="80px"></el-table-column>
      <el-table-column label="手机号" prop="Contact" width="100px"></el-table-column>
      <el-table-column label="城市" prop="City" width="100px"></el-table-column>
      <el-table-column label="会员数" prop="user_num" width="60px"></el-table-column>
      <el-table-column label="活动数" prop="active_num" width="60px"></el-table-column>
      <el-table-column label="创建时间" prop="CreateTime" width="140px"></el-table-column>
      <el-table-column label="操作" width="180px">
        <template slot-scope="item">
          <el-button size="mini">查看</el-button>
          <el-dropdown
            size="mini"
            split-button
            style="margin-left:10px"
            @command="userSet($event,item.row)"
          >
            更多
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item :command="0" v-if="is_apply != '1'">同意</el-dropdown-item>
              <el-dropdown-item :command="1" v-if="is_apply != '1'">拒绝</el-dropdown-item>
              <el-dropdown-item :command="2" v-if="is_apply == '1'">解除关系</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </template>
      </el-table-column>
    </el-table>
    <div class="page-box">
      <el-pagination
        background
        small
        :current-page="list.current_page"
        :page-size="list.per_page"
        layout="total, prev, pager, next, jumper"
        :total="list.total"
        @current-change="changePage"
      ></el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  props: { is_apply: {} },
  data() {
    return {
      list: {
        current_page: 1,
        data: []
      },
      loading: true
    };
  },
  mounted() {
    this.getData();
  },
  methods: {
    //页面加载数据
    getData() {
      this.loading = true;
      this.ajaxs("club/getChildList", {
        data: { page: this.list.current_page, is_apply: this.is_apply },
        success: res => {
          this.list = res.msg;
          console.log(res);
          this.loading = false;
        }
      });
    },
    //分页
    changePage(e) {
      this.list.current_page = e;
      this.getData();
    },
    //更多
    userSet(e, data) {
      switch (e) {
        case 0:
          var data = { club_id: data.Id, is_apply: this.is_apply };
          var url = "club/agreeChild";
          break;
        case 1:
          var url = "club/refuseChild";
          var data = { club_id: data.Id, is_apply: this.is_apply };
          break;
        case 2:
          var url = "club/disengagement";
          var data = { club_id: data.Id, style: 1 };
          break;
      }
      this.ajaxs(url, {
        data: data,
        success: res => {
          this.toast(res.code, res.msg);
          if (res.code) {
            this.getData();
            this.$parent.getData();
          }
        }
      });
    }
  },
  watch: {
    is_apply() {
      this.list = {
        current_page: 1,
        data: []
      };
      this.getData();
    }
  }
};
</script>

<style>
</style>